<%@ taglib prefix="date" uri="http://www.springframework.org/tags/form" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<html  ng-app="userFirst">
<head>
	<meta charset="utf-8">
	<title>智能报修系统——欢迎您，用户！</title>
	<link  type="text/css"  rel="stylesheet" href="<%= request.getContextPath()%>resources/css/style.css" />
	<link rel="stylesheet" type="text/css" href="<%= request.getContextPath()%>resources/css/head.css"/>
	<link rel="stylesheet" type="text/css" href="<%= request.getContextPath()%>resources/css/staffLeft.css"/>
	<link rel="stylesheet" type="text/css" href="<%= request.getContextPath()%>resources/css/userFirst.css" />

	<%--交互样式所需css--%>
	<link rel="stylesheet" type="text/css" href="<%= request.getContextPath()%>resources/css/jNotify.jquery.css"/>

	<script type="text/javascript">
        //进入用户首页，提示先去完善用户资料的js
        function closeWarn(){
            document.getElementById("warnInfor").style.display="none";
        }



        //报修时提醒选择问题小类的js
        function WarnQues(){
            document.getElementById("warnQues").style.display="block";
        }
        function openwindow(){
            document.getElementById("warnQues").style.display="block";
        }
        function closeWarnQues(){
            document.getElementById("warnQues").style.display="none";
        }

        //整个用户界面左边导航栏的切换，包括带动右边对应内容的改变
        window.onload=function(){
            var operationLi=document.getElementById("operation").getElementsByTagName("li");
            var one=document.getElementsByClassName("search");
            for (var i=0;i<operationLi.length;i++) {
                operationLi[i].index=i;
                operationLi[i].onclick=function(){
                    for (var j=0;j<operationLi.length;j++) {
                        operationLi[j].className="";
                        one[j].style.display="none";
                    }
                    this.className="active";
                    //这里的i一直为4,所以要通过operationLi[i].index=i;来转换，然后用this来表示
                    one[this.index].style.display="block";
                }
            }
        }
	</script>
	<script type="text/javascript" src="<%= request.getContextPath()%>resources/js/jquery.js"></script><!--jquery压缩包-->
	<script type="text/javascript" src="<%= request.getContextPath()%>resources/js/script.js"></script><!--用户评分代码-->
	<script type="text/javascript" src="<%= request.getContextPath()%>resources/js/jquery.min.js"></script>	<!--另外一个jquery压缩包-->
	<script type="text/javascript" src="<%= request.getContextPath()%>resources/js/uploadImg.js" charset="utf-8"></script><!--上传图片的代码-->
	<script type="text/javascript" src="<%= request.getContextPath()%>resources/js/angular.min.js" charset="utf-8"></script>
	<script type="text/javascript" src="<%= request.getContextPath()%>resources/js/userFirstController.js" charset="utf-8"></script>
</head>
<body ng-controller="userFirstController">
<!--页面的头部开始-->
<div id="head">
	<div id="head_con">
		<p class="title">智能报修系统</p>
		<div id="head_right">
			<a href="#">收件箱</a>
			<button id="downloadAPP">APP下载</button>
		</div>
	</div>
</div>
<!--页面的头部结束-->

<!--页面的左边开始-->
<div id="staffLeft">
	<div id="staffLeftCon">
		<div id="staffInfo" >
			<p class="staffName">{{user.userName}}</p>
			<p class="staffNum">{{user.userAccount}}</p>
			<p class="place">用户</p>
		</div>
		<div id="operation">
			<ul >
				<li  class="active" >首页</li>
				<li  ng-click="baoxiujingdu()">报修进度</li>
				<li   ng-click="lookHistoryWork()">历史工单</li>
				<li >个人资料</li>
			</ul>
		</div>
		<div class="phoneNum">
			{{servicephone.name}} :{{servicephone.content}}
		</div>
	</div>
</div>
<!--页面的左边结束-->

<!--首页，创建工单报修开始-->
<div id="updateTask" class="search" style="display:block;">
	<p id="optionWord" class="optionWord">请选择问题描述:</p>

	<!--报修问题分类开始-->
	<div id="checkBox" class="checkBox">
		<form action="" method="get">
			<div class="left" ng-model="question">
				<select style="display: block;margin-top:50px" ng-model="selected" ng-change="chooseques()">
					<option  class="one" name="Fruit" type="radio" value="{{x.one}},{{x.userName}},{{x.userPhone}}" ng-repeat="x in questions"  />{{x.one}}</option>
				</select>
				<h4 style="margin-top:30px;">您的选择是：{{selected}}</h4>
			</div>
		</form>
	</div>
	<!--报修问题分类结束-->

	<!--填写报修人的地址和电话开始-->
	<div id="positonTask" class="positionTask">
		<p id="positionWord" class="positionWord">请填写您的报修地点:</p>
		<input type="text" id="useraddress" ng-model="useraddress"  class="positionInput"/>
		<%--<p id="tellWord" class="tellWord">请填写您的电话:</p>--%>
		<%--<input type="text"  class="tellInput" ng-model="user_phone" />--%>
	</div>
	<!--填写报修人的地址和电话结束-->

	<!--工单提交按钮开始-->
	<div style="left:40%" class="updateButton" type="button" ng-click="test()" value="提交" />提交</div>
<!--工单提交按钮结束-->

<!--提示去完善用户的个人资料开始-->
<%--<div id="warnInfor" class="warnInfor" style="display: block;">--%>
<%--<img src="../../resources/img/关闭.png" onclick="closeWarn()" />--%>
<%--<p >请先去个人资料页面完善用户信息哦！</p>--%>
<%--<button onclick="closeWarn()">知道了</button>--%>
<%--</div>--%>
<!--提示去完善用户的个人资料结束-->

<!--提示选择问题大类后面的小类开始-->
<div id="warnQues" class="warnInfor" style="display: none;">
	<img src="../../resources/img/关闭.png" onclick="closeWarnQues()" />
	<p >请选择该问题后面的小类哦！</p>
	<button onclick="closeWarnQues()">知道了</button>
</div>
<!--提示选择问题大类后面的小类结束-->



</div>
<!--首页，创建工单报修结束-->


<!--报修进度开始-->
<div id="processing" class="search" style="display:none;">
	<!--报修进度资料开始-->
	<div id="theTask" class="theTask">
		<ul class="taskbabel">
			<li>工单号:</li>
			<li>问题:</li>
			<li>运维人员:</li>
			<li>运维人员电话:</li>
			<li>创建时间：</li>
			<li>创建人:</li>
			<li>已耗时：</li>
		</ul>
		<form>
			<input class="input num" type="text" ng-model="jobnumber" /><br />
			<input class="input matter"  type="text"  ng-model="details"/><br />
			<input class="input people"  type="text" ng-model="userName" /><br />
			<input class="input tell" type="text"   ng-model="userPhone"/><br />
			<input class="input createTime " type="text" ng-model="dt3"/><br />
			<input class="input cratePeole"  type="text"  ng-model="userAccount"/><br />
			<input  class="input allTime" type="text" ng-model="dt1" /><br />
		</form>
	</div>
	<!--报修进度资料结束-->

	<!--评价和投诉开始-->
	<div id="remarkThrow" class="remarkThrow">

		<span>请为运维人员的表现打个分吧！</span>
		<p style="margin-top: 20px;margin-left: 36px;color:#4E7500;">只能评价一次哦！</p>

		<!--评价星星开始-->
		<div id="xzw_starSys">
			<div id="xzw_starBox">
				<ul class="star" id="star">
					<li><a  title="1" ng-click="userRemark(jobnumber,1)"  class="one-star">1</a></li>
					<li><a  title="2" ng-click="userRemark(jobnumber,2)"  class="two-stars">2</a></li>
					<li><a  title="3" ng-click="userRemark(jobnumber,3)"  class="three-stars">3</a></li>
					<li><a  title="4" ng-click="userRemark(jobnumber,4)"  class="four-stars">4</a></li>
					<li><a  title="5" ng-click="userRemark(jobnumber,5)"  class="five-stars">5</a></li>
				</ul>
				<div class="current-rating" id="showb"></div>
			</div>
			<!--评价文字-->
			<div class="description"></div>
		</div>
		<!--评价星星结束-->

		<!--投诉开始-->
		<div id="thorw" class="theThrow">
			<img src="../../resources/img/2.png" class="thowPic" />
			<button class="throwButton" type="button"  ng-click="userComplain()">点击投诉</button>
		</div>
		<!--投诉结束-->

	</div>
	<!--评价和投诉结束-->

</div>
<!--报修进度结束-->


<!--历史工单开始-->
<div id="myTask" class="search" style="display:none;">
	<!--历史工单头开始-->
	<ul>
		<li><a class="all" href="#">已完成</a></li>
	</ul>
	<!--历史工单头结束-->

	<!--历史工单列表开始-->
	<div id="allTask" class="allTask" style="display:block;">
		<table id="allTaskTable" class="allTaskTable" border="0"  cellspacing="0">
			<tr class="weightGreenColor"   style="align-content: center;">
				<th class="missionTim">创建时间</th>
				<th class="taskNum">工单号</th>
				<th class="question">问题描述</th>
				<th class="taskWorker">运维人员</th>
				<th class="remark">评论</th>
				<th class="throw">投诉</th>
			</tr>
			<tr class="weightGreenColor"   ng-repeat="x in historyWork" style="text-align: center;">
				<td class="missionTim" >{{x.uploadTime| date:'yyyy-MM-dd HH:mm:ss'}}</td>
				<td  class="taskNum">{{x.jobnumber}}</td>
				<td class="question"><p>{{x.details}}</p></td>
				<td class="taskWorker">{{x.receiveOne}}&nbsp;<span>{{x.userPhone}}</span></td>
				<td class="remark"  >{{x.commentStar}}分</td>
				<td class="throw">{{x.commentContent|reverse}}</td>

			</tr>

		</table>
	</div>
	<!--历史工单列表结束-->

	<!--上下页开始-->
	<div id="missionPage" class="missionPage">
		<p class="upPage">上一页</p>
		<p class="nowPage">第<span>1</span>页</p>
		<p class="downPage">下一页</p>
	</div>
	<!--上下页结束-->
</div>
<!--历史工单结束-->


<!--学生个人资料开始-->
<div id="myInfor" class="search" style="display:none;">
	<div class="allPersonInfor">
		姓名：<input type="text" class="personname" readonly="readonly" ng-model="user.userName"  disabled="disabled" /><br />
		地址：<input type="text" ng-model="user.userAddress"  class="personalInfor" /><br />
		电话：<input type="text" ng-model="user.userPhone"  class="personalInfor"  maxlength="11"/><br />
		<input type="button"  ng-click="updateStudentInfo()" value="保存" class="personalInforSave" /><br />
	</div>
</div>
<!--学生个人资料结束-->

<!--教师个人资料开始-->
<div id="teacherInfor" class="search" style="display:none;">
	<div class="allPersonInfor teacherInfor">
		姓名：<input  disabled="disabled" type="text" value="黎子新" class="personalInfor" /><br />
		工号：<input  disabled="disabled" type="text" value="1508787878" class="personalInfor" /><br />
		部门：<input  disabled="disabled" type="text" value="网络部" class="personalInfor" /><br />
		电话：<input  disabled="disabled" type="text" value="12233344455" class="personalInfor" maxlength="11" /><br />
		地址：<input type="text" value="四川旅游学院" class="personalInfor" /><br />
		<input type="button" value="保存" class="personalInforSave teacherSave" /><br />
	</div>
</div>
<!--教师个人资料结束-->


<!--版权声明开始-->
<div id="footer" class="footer">
	<p class="footerWord">版权所有&nbsp;四川旅游学院</p>
</div>
<!--版权声明结束-->

<script type="text/javascript" src="<%= request.getContextPath()%>resources/js/jquery-3.1.1.min.js"></script>
<script type="text/javascript" src="<%= request.getContextPath()%>resources/js/jNotify.jquery.js"></script>

</body>

</html>
